$(function() {
	var $slides = $('.slide_pics li');
	var len = $slides.length;
	var nowli = 0;
	var prevli = 0;
	var $prev = $('.prev');
	var $next = $('.next');
	var ismove = false;
	var timer = null;
	$slides.not(':first').css({
		left : 760
	});
	$slides.each(function(index, el) {
		var $li = $('<li>');
		if (index == 0) {
			$li.addClass('active');
		}
		$li.appendTo($('.points'));
	});
	$points = $('.points li');
	timer = setInterval(autoplay, 4000);

	$('.slide').mouseenter(function() {
		clearInterval(timer);
	});

	$('.slide').mouseleave(function() {
		timer = setInterval(autoplay, 4000);
	});

	function autoplay() {
		nowli++;
		move();
		$points.eq(nowli).addClass('active').siblings().removeClass('active');
	}

	$points.click(function(event) {
		if (ismove) {
			return;
		}
		nowli = $(this).index();
		if (nowli == prevli) {
			return;
		}
		$(this).addClass('active').siblings().removeClass('active');
		move();
	});

	$prev.click(function() {
		if (ismove) {
			return;
		}
		nowli--;
		move();
		$points.eq(nowli).addClass('active').siblings().removeClass('active');
	});

	$next.click(function() {
		if (ismove) {
			return;
		}
		nowli++;
		move();
		$points.eq(nowli).addClass('active').siblings().removeClass('active');
	});

	function move() {
		ismove = true;
		if (nowli < 0) {
			nowli = len - 1;
			prevli = 0
			$slides.eq(nowli).css({
				left : -760
			});
			$slides.eq(nowli).animate({
				left : 0
			}, 800, 'easeOutExpo');
			$slides.eq(prevli).animate({
				left : 760
			}, 800, 'easeOutExpo', function() {
				ismove = false;
			});
			prevli = nowli;
			return;
		}
		if (nowli > len - 1) {
			nowli = 0;
			prevli = len - 1;
			$slides.eq(nowli).css({
				left : 760
			});
			$slides.eq(nowli).animate({
				left : 0
			}, 800, 'easeOutExpo');
			$slides.eq(prevli).animate({
				left : -760
			}, 800, 'easeOutExpo', function() {
				ismove = false;
			});
			prevli = nowli;
			return;
		}
		if (prevli < nowli) {
			$slides.eq(nowli).css({
				left : 760
			});
			$slides.eq(prevli).animate({
				left : -760
			}, 800, 'easeOutExpo');
			$slides.eq(nowli).animate({
				left : 0
			}, 800, 'easeOutExpo', function() {
				ismove = false;
			});
			prevli = nowli;
		} else {
			$slides.eq(nowli).css({
				left : -760
			});
			$slides.eq(prevli).animate({
				left : 760
			}, 800, 'easeOutExpo');
			$slides.eq(nowli).animate({
				left : 0
			}, 800, 'easeOutExpo', function() {
				ismove = false;
			});
			prevli = nowli;
		}
	}
})